import React from 'react';
import { Row, Col, Form, Input, Button, Modal, Spin, DatePicker } from 'antd';

const FormItem = Form.Item;
const formLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 14 },
};

export default class MfgPlanUpdate extends React.Component<any, any> {
  handleSumit = (values: any) => {
    const { onSubmit } = this.props;
    if (typeof onSubmit === 'function') {
      onSubmit(values);
    }
  };
  formRender = () => {
    const { formVals = {} } = this.props;
    return (
      <Form {...formLayout} initialValues={formVals} onFinish={this.handleSumit}>
        <Row gutter={16}>
          <Col span={12}>
            <FormItem name="" label="产品编号">
              <Input placeholder="请输入产品编号"/>
            </FormItem>
          </Col>
          <Col span={12}>
            <FormItem name="" label="物料">
              <Input placeholder="请输入物料" />
            </FormItem>
          </Col>
          <Col span={12}>
            <FormItem name="" label="数量">
              <Input placeholder="请输入数量"/>
            </FormItem>
          </Col>
          <Col span={12}>
            <FormItem name="" label="仓库">
              <Input  placeholder="请输入仓库"/>
            </FormItem>
          </Col>
          <Col span={12} style={{ display: 'flex', justifyContent: 'flex-end', paddingRight: 62 }}>
            <Button type="primary" htmlType="submit">
              确认
            </Button>
          </Col>
        </Row>
      </Form>
    );
    };
      render() {
    const { visible, onCancel, loading = false } = this.props;
    const FormRender = this.formRender;
    return (
      <Modal
        title= '创建计划单'
        width="81px"
        bodyStyle={{ padding: 24 }}
        visible={visible}
        destroyOnClose
        footer={null}
        onCancel={() => onCancel()}
      >
        <Spin spinning={loading}>
          <FormRender />
        </Spin>
      </Modal>
    );
  }
}
